<template>
  <div class="qr-code">
    <!--  返回按钮 -->
    <van-nav-bar
      id="saoma"
      class="titleStyle"
      title="二维码/条码"
      left-arrow
      @click-left="onClickLeft"
    />
    <div class="saomaTwo">
      <div id="bcid" />
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
let scan = null;
export default {
  name: "SaomaShow",
  data() {
    return {
      codeUrl: "",
      str: "",
      data: {},
    };
  },
  created() {
    // 获取路由参数 判断是从哪个页面扫码进来的
    let obj = new Object();
    obj = this.$route.query;
    this.str = obj.name;
    // console.log(this.str)
    // const result = 'PC20240812003%01'
    // switch (this.str) {
    //   case '首件检':
    //     this.$router.push({ name: 'FirstInspection', params: { code: result, name: '首件检' } })
    //     break
    //   case '巡检':
    //     this.$router.push({ name: 'PatrolInspection', params: { code: result, name: '巡检' } })
    //     break
    //   case '工序检':
    //     this.$router.push({ name: 'ProcessInspection', params: { code: result, name: '工序检' } })
    //     break
    //   case '成品检':
    //     this.$router.push({ name: 'FinishedProInspection', params: { code: result, name: '成品检' } })
    //     break
    //   case '设备点检':
    //     this.$router.push({ name: 'EquipmentInspection', params: { code: result, name: '设备点检' } })
    //     break
    //   case '隔离品处置':
    //     this.$router.push({ name: 'IsolationProductDisposal', params: { code: result, name: '隔离品处置' } })
    //     break
    // }
  },
  activated() {
    // 开启摄像头
    this.startRecognize();
  },
  async mounted() {
    setTimeout(() => {
      this.startRecognize();
    }, 500);
  },
  beforeDestroy() {
    if (scan) {
      // 关闭扫描控件
      scan.close();
    }
  },
  methods: {
    onClickLeft() {
      this.closeScan();
      this.$router.go(-1);
    },
    async startRecognize() {
      const that = this;
      if (!window.plus) return;
      // 创建扫描控件
      scan = new plus.barcode.Barcode(
        "bcid",
        [plus.barcode.QR, plus.barcode.CODE128],
        { frameColor: "#00FF00", scanbarColor: "#00FF00" }
      );
      // 开始扫描
      scan.start();
      scan.onmarked = onmarked;
      function onmarked(type, result, file) {
        const codes = result.split(":");
        const key = codes[0];
        const value = codes[1];
        switch (type) {
          case plus.barcode.QR:
            type = "QR";
            break;
          case plus.barcode.CODE128:
            type = "CODE128";
            break;
          default:
            type = "其它" + type;
            break;
        }
        scan.close();
        switch (that.str) {
          case "首件检":
            that.$router.push({
              name: "FirstInspection",
              params: { code: result, name: "首件检" },
            });
            break;
          case "巡检":
            that.$router.push({
              name: "PatrolInspection",
              params: { code: result, name: "巡检" },
            });
            break;
          case "工序检":
            that.$router.push({
              name: "ProcessInspection",
              params: { code: result, name: "工序检" },
            });
            break;
          case "成品检":
            that.$router.push({
              name: "FinishedProInspection",
              params: { code: result, name: "成品检" },
            });
            break;
          case "设备点检":
            that.$router.push({
              name: "EquipmentInspection",
              params: { code: result, name: "设备点检" },
            });
            break;
          case "隔离品处置":
            that.$router.push({
              name: "IsolationProductDisposal",
              params: { code: result, name: "隔离品处置" },
            });
            break;
          case "首件检":
            that.$router.push({
              name: "FirstInspection",
              params: { code: result, name: "首件检" },
            });
            break;
        }
      }
    },
    /**  关闭相机 */
    closeScan() {
      if (scan) {
        // 关闭扫描控件
        scan.close();
      }
    },
  },
};
</script>

<style scoped lang="scss">
.saomaTwo {
  background: black;
  position: fixed;
  top: 55px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
}
.qr-code {
  background-color: #faf8f5;
}
#bcid {
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 60px;
  bottom: 3rem;
  text-align: center;
  color: #fff;
  background: #000;
}
.btn {
  position: fixed;
  background-color: #000 !important;
  z-index: 999;
  color: #ccc !important;
  font-size: 35px !important;
  height: 40px;
  margin: 15px;
  margin-top: 1px;
  box-shadow: none !important;
}
</style>
